<template>
	<view class="page">
		<view class="address-input">
			<view class="list-input">
				<view class="title">
					<text>收货人</text>
				</view>
				<view class="content">
					<input type="text" placeholder="请填写收货人姓名" v-model="value.name">
				</view>
			</view>
			<view class="list-input">
				<view class="title">
					<text>手机号</text>
				</view>
				<view class="content">
					<input type="tel" placeholder="请填写收货人手机号" v-model="value.mobile">
				</view>
			</view>
			<view class="list-input">
				<view class="title">
					<text>收货地址</text>
				</view>
				<view class="content" @click="picker">
					<!-- <text @tap="open">省市区</text> -->
					<text>省市区</text>
				</view>

				<!-- <cityPicker :column="column" :default-value="defaultValue" :mask-close-able="maskCloseAble"
					@confirm="confirm" @cancel="cancel" :visible="visible" /> -->
				<view>{{str}} </view>


			</view>
			<view class="list-textarea">
				<view class="title">
					<text>详细地址</text>
				</view>
				<view class="content">
					<textarea type="tel" placeholder="街道/楼牌号等" v-model="value.buildNum"/>
				</view>
			</view>
		</view>
		<view class="tag-default">

			<view class="default-address">
				<view class="title">
					<text>默认地址</text>
				</view>
				<view class="switch-default">
					<switch class="red sm" color="#0077EE !important" :checked='checked'></switch>
				</view>
			</view>
		</view>
		<view class="footer-btn">
			<view class="btn" @click="setAddressEdit">
				<text>保存</text>
			</view>
		</view>
	</view>







</template>

<script>
	import cityPicker from '@/uni_modules/piaoyi-cityPicker/components/piaoyi-cityPicker/piaoyi-cityPicker'
	import {setAddress} from '@/config/api.js'
	export default {
		data() {
			return {
				visible: false,
				maskCloseAble: true,
				str: '',
				defaultValue: '',
				// defaultValue: ['河北省','唐山市','丰南区'],
				column: 3,
				addressType: '2',
				value: {
					name: '',
					mobile: null,
					buildNum: '',
					address: null,
					latitude_wx: null,
					longitude_wx: null
				},
				checked:true
			}
		},
		onLoad(params) {
			this.addressType = params.type || '2';
			uni.setNavigationBarTitle({
				title: this.addressType === '1' ? '编辑收货地址' : '新建收货地址'
			})
		},
		components: {
			cityPicker
		},
		methods: {
			open() {
				this.visible = true
			},
			confirm(val) {
				console.log(val)
				this.str = JSON.stringify(val)
				this.visible = false
			},
			cancel() {
				this.visible = false
			},
			setAddressEdit(){
				let _this = this
				setAddress({
					address:_this.value.address+_this.value.buildNum,
					latitude_wx: _this.value.latitude_wx,
					longitude_wx: _this.value.longitude_wx,
					name: _this.value.name,
					is_default: _this.checked?1:0,
					mobile: _this.value.mobile
				}).then(data=>{
					console.log(data)
				}).catch(err=>{
					console.log(err)
				})
			},
			picker(){
				const _this = this;
				uni.getLocation({
				      type: 'wgs84',
				      // 返回可以用于uni.openLocation的经纬度
				      success: function success(res) {
				        console.log('经度: ' + res.latitude);
				        console.log('纬度: ' + res.longitude);
				        uni.chooseLocation({
				        	latitude:res.latitude,
				        	longitude:res.longitude,
				        	success: function(res){
				        		console.log(res)
								_this.value.address=res.address
								_this.value.latitude_wx = res.latitude
								_this.value.longitude_wx = res.longitude
				        	},
				          fail: function (err) {
				              console.error('选择地点失败:', err);
				          }
				        })
				      },
				
				      fail: function fail(err) {
				        console.error('获取位置失败:', err);
				      }
				    });
				// wx.getLocation({
				// 	type: 'gcj02',
				// 	success(res){
				// 		console.log(res)
				// 		const latitude = res.latitude
				// 		const longitude = res.longitude
				// 		wx.openLocation({
				// 			latitude,
				// 			longitude,
				// 			scale: 18,
				// 			success: function(res){
				// 				console.log(res,'111111111')
				// 			}
				// 		})
				// 	},fail:function(err){
				// 		console.log(err)
				// 	}
				// })
			}
		},

		onShareTimeline(res) {
			if (res.from === 'button') { // 来自页面内分享按钮
				console.log(res.target)
			}
			return {
				title: 'data-cityPicker省市区地址选择器！'
			}
		}
	}
</script>

<style lang="scss">
	@import 'AddressEdit.scss';
</style>